<template>
  <div class="home">
    <HelloWorld />
  </div>
</template>

<script>
// @ is an alias to /src
import HelloWorld from '@/components/HelloWorld.vue'
import ArrayDemo from '@/components/ArrayDemo.vue'

import { ref, reactive } from 'vue'

export default {
  name: 'HomeView',
  components: {
    HelloWorld,
    ArrayDemo: ArrayDemo
  },
  setup(){
    var arr1 = ref([1,2,3])
    var arr = ref([
      {
        id: 1,
        name: "sdf"
      },
      {
        id: 2,
        name: "2sdf"
      }
    ])
    let nameArr=[]
    for(let i=0;i<arr.value.length;i++){
      console.log("i",arr.value[i])
      nameArr.push(arr.value[i].name)
    }
    console.log('nameArr',nameArr);

  },
  mounted(){
    // this.getData()
    console.log('this',this);
    // this.testRef()
  },
  methods:{
    getData(){
      this.$http.get("http://localhost:3000/")
      .then(res=>{
        console.log('res:',res);
      })
      .catch(err=>{
        console.log('err:',err);
      })
    }
  }
}
</script>
